import React, { PureComponent } from 'react';
import { Input, Form, Cascader, Select, Modal, Row, Col, Button, Upload } from 'antd';
import { isZhengda, isAnte, isBinhai, isZhongZheng, isHaoxuexi, hasCompany, isKean } from '@/utils/utils'
const layout = {
    labelCol: { span: 6 },
    wrapperCol: { span: 12 },
}
class ShowModal extends PureComponent<any, any> {
    state={
        img:'',
        showImg:false
    }
    showImgHandle = (img:string)=>()=>{
        console.log(img)
        this.setState({
            showImg:true,
            img:img
        })
    }
    render() {
        const { options, id_number,
            name,
            type,
            student_type,
            sexy,
            duty,
            age,
            showVisible,
            phone,
            subject,
            typeList,
            integral,
            exam_date,
            company,
            invoice_img,
            invoice,
            idcard,
            photo, id_card_front, id_card_back, diploma, family_register, month, year,
        } = this.props.data;
        const { hideShowPerson } = this.props;
        const{showImg,img} = this.state;
        return (
           <React.Fragment>
               <Modal visible={showImg} footer={null} onCancel={()=>this.setState({showImg:false})}>
                   <img style={{width:'100%'}} src={img} alt=""/>
               </Modal>
                <Modal visible={showVisible}
                footer={[<Button type="primary" onClick={() => hideShowPerson()} key="1">确定</Button>]}
                onCancel={() => hideShowPerson()}
                title="查看用户">
                <Row>
                    <Col span={24}>
                        <Form>
                            <Form.Item  {...layout} label="准考证号">
                                <Input placeholder="" readOnly value={id_number} />
                            </Form.Item>
                            {
                                (isZhongZheng() && Number(idcard) === Number(idcard)) ? <Form.Item  {...layout} label="编号">
                                    <Input placeholder="" readOnly value={idcard} />
                                </Form.Item> : null
                            }
                            <Form.Item  {...layout} label="姓名">
                                <Input placeholder="" readOnly value={name} />
                            </Form.Item>
                            <Form.Item  {...layout} label="部门">
                                <Cascader placeholder="" options={options} disabled value={student_type} />
                            </Form.Item>
                            <Form.Item  {...layout} label="联系电话">
                                <Input value={phone || null} style={{ width: '100%' }} readOnly></Input>
                            </Form.Item>
                            <Form.Item  {...layout} label="性别">
                                <Select placeholder="" aria-readonly value={sexy}>
                                    <Select.Option value="3" key="3">保密</Select.Option>
                                    <Select.Option value="1" key="1">男</Select.Option>
                                    <Select.Option value="2" key="2">女</Select.Option>
                                </Select>
                            </Form.Item>
                            <Form.Item  {...layout} label="科目">
                                <Input value={subject} readOnly></Input>
                            </Form.Item>
                            {
                                hasCompany() && <Form.Item  {...layout} label="公司名称">
                                    <Input value={company} readOnly></Input>
                                </Form.Item>
                            }
                            {
                                isZhengda() && <Form.Item  {...layout} label="考试时间">
                                    <Input value={exam_date} readOnly></Input>
                                </Form.Item>
                            }
                            {(isAnte() || isZhongZheng()) && <Form.Item  {...layout} label="发票编号">
                                <Input value={invoice || ''} readOnly></Input>
                            </Form.Item>
                            }
                            {
                                isKean() && <React.Fragment>
                                    <Form.Item  {...layout} label="本人照片">
                                       <a onClick={this.showImgHandle(photo)} target="blank">查看</a>
                                    </Form.Item>
                                    <Form.Item  {...layout} label="身份证">
                                       <a onClick={this.showImgHandle(id_card_front)} target="blank" style={{marginRight:10}}>查看正面</a>
                                       <a onClick={this.showImgHandle(id_card_back)}  target="blank">查看背面</a>
                                    </Form.Item>
                                    <Form.Item  {...layout} label="毕业证">
                                       <a onClick={this.showImgHandle(diploma)}  target="blank">查看</a>
                                    </Form.Item>
                                    <Form.Item  {...layout} label="户口页">
                                       <a onClick={this.showImgHandle(family_register)} target="blank">查看</a>
                                    </Form.Item>
                                    <Form.Item  {...layout} label="往年培训时间">
                                      {year}-{month}
                                    </Form.Item>
                                </React.Fragment>
                            }
                            {/* {isAnte() && <Form.Item  {...layout} label="发票图片">
                                <Upload fileList={invoice_img}></Upload>
                            </Form.Item>
                            } */}
                            {/* <Form.Item  {...layout} label="职务">
                                <Select  placeholder="" aria-readonly value={duty}>
                                    {
                                        positionData.map(item => {
                                            return <Select.Option key={item.id} value={item.id}>{item.name}</Select.Option>
                                        })
                                    }
                                </Select>
                            </Form.Item> */}
                            <Form.Item  {...layout} label="级别">
                                <Select placeholder="" aria-readonly value={type} disabled>
                                    <Select.Option value={2} key="2">考生</Select.Option>
                                    {
                                        typeList.map(item => {
                                            return <Select.Option value={item.id} key={item.id}>{item.name}</Select.Option>
                                        })
                                    }
                                </Select>
                            </Form.Item>
                            <Form.Item  {...layout} label="积分">
                                <Input value={integral} readOnly></Input>
                            </Form.Item>
                        </Form>
                    </Col>

                </Row>
            </Modal>
           </React.Fragment>
        );
    }
}

export default ShowModal;
